{% extends "admin/base.html" %}
{% block func_name %}
    注册队伍管理 <a data-toggle="modal" data-target="#newTeamModal"><i class="fa fa-plus-square"></i></a>&nbsp;&nbsp;<a href="{{ url_for('admin.dump_teams') }}" target="_blank">导出所有注册信息</a>
{% endblock %}
{% block content %}

    <div class="row">
        <div class="col-lg-12">
            {% for team in teams_data %}
            <div class="panel panel-default">
                <div class="panel-heading">
                    <i class="fa fa-users"></i>  {{ team.name }}
                    <div class="pull-right">
                        <div class="btn-group">
                            <button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown">
                                行为
                                <span class="caret"></span>
                            </button>
                            <ul class="dropdown-menu pull-right" role="menu">
                                <li><a href="#">暂时没想好有什么动作可以做</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <!-- /.panel-heading -->
                <div class="panel-body">
                    <table class="table table-bordered table-hover table-striped">
                        <thead>
                            <tr>
                                <th>姓名</th>
                                <th>电话</th>
                                <th>身份证</th>
                                <th>地址</th>
                                <th>状态</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody>
                        {% for member in team.members %}
                            <tr>
                                <td>{{ member.realName or "未填" }}</td>
                                <td>{{ member.mobile }}</td>
                                <td>{{ member.idNo or "未填" }}</td>
                                <td>{{ member.address or "未填" }}</td>
                                <td>{{ STATUS[member.status] }}</td>
                                <td>
                                    <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#modal_{{ member.id }}">
                                      更正注册电话
                                    </button>
                                    <!-- Modal -->
                                    <div class="modal fade" id="modal_{{ member.id }}" tabindex="-1" role="dialog" aria-labelledby="modalLabel_{{ member.id }}" aria-hidden="true">
                                      <div class="modal-dialog" role="document">
                                        <div class="modal-content">
                                          <form class="modifyMobile" action="{{ url_for('admin.change_mobile', team_id=member.teamId, member_id=member.id) }}">
                                          <div class="modal-header">
                                            <h5 class="modal-title" id="modalLabel_{{ member.id }}">更正电话{{ member.mobile }}</h5>
                                          </div>
                                          <div class="modal-body">
                                              <input type="tel" name="mobile" class="form-control" value="{{ member.mobile }}" />
                                          </div>
                                          <div class="modal-footer">
                                            <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                                            <button type="submit" class="btn btn-primary">保存变更</button>
                                          </div>
                                          </form>      
                                        </div>
                                      </div>
                                    </div>

                                </td>
                            </tr>
                        {% endfor %}
                        </tbody>
                    </table>
                </div>
                <!-- /.panel-body -->
            </div>
            {% endfor %}

        <nav aria-label="Page navigation example">
          <ul class="pagination">
            <li class="page-item"><a class="page-link" href="{{ url_for('admin.manage_teams', name=name, p=prev_id) }}">上一页</a></li>
           {% for i in range(1, page_count + 1) %}
            <li class="page-item"><a class="page-link" href="{{ url_for('admin.manage_teams', name=name, p=i) }}">{{ i }}</a></li>
           {% endfor %}
            <li class="page-item"><a class="page-link" href="{{ url_for('admin.manage_teams', name=name, p=next_id) }}">下一页</a></li>
          </ul>
        </nav>
        </div>

    </div>
    <div class="modal fade" id="newTeamModal" tabindex="-1" role="dialog" aria-labelledby="teamLabel" aria-hidden="true">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <form action="" id="newTeamForm">
          <div class="modal-header">
            <h5 class="modal-title" id="teamLabel">新建团队</h5>
          </div>
          <div class="modal-body">
              <div class="form-group">
                <label for="title">队伍名</label>
                <input name="teamName" type="text" class="form-control" id="title" placeholder="输入队伍的名字">
              </div>
              <div class="form-group">
                <label for="exampleFormControlTextarea1">成员电话(一行一个, 第一行是队长)</label>
                <textarea name="mobiles" class="form-control" id="exampleFormControlTextarea1" rows="5"></textarea>
              </div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
            <button type="submit" class="btn btn-primary">保存</button>
          </div>
          </form>
        </div>
      </div>
    </div>

{% endblock %}
{% block script %}
    <script>
    $(function () {
        $('.modifyMobile').submit(function (e) {
            e.preventDefault();
            $.post($(this).attr('action'), $(this).serialize(), function (resp) {
                if (resp.code == 200){
                    location.reload();
                }else{
                    alert(resp.error);
                }
            }, 'json')
        })
        $("#newTeamForm").submit(function (e) {
            e.preventDefault();
            $.post('{{ url_for("admin.create_team") }}', $(this).serialize(), function (resp) {
                if (resp.code == 200){
                    location.reload();
                }else{
                    alert(resp.error);
                }
            }, 'json')

        })
    })
    </script>
{% endblock %}
